<script setup lang="ts">
import { onMounted } from 'vue';
import MySubjectList from './components/MySubjectList.vue';
import SubjectList from './components/SubjectList.vue';
import { router } from '@/router';

onMounted(() => {
    document.body.addEventListener('touchstart', () => {}, { passive: true });
})

const back = () => {
    console.log("我要准备返回了嘛？")
    router.push('/home');
}
</script>

<template>
    <div class="subject-list-container">
        <div class="page-header">
            <h1 class="page-title">刷题测验</h1>
            <div class="page-description">
                管理您的题目集，开始刷题之旅
            </div>
        </div>
        
        <MySubjectList />
        <SubjectList />
    </div>
</template>

<style lang="scss" scoped>
.subject-list-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 24px;
    
    .page-header {
        margin-bottom: 32px;
        
        .page-title {
            font-size: 28px;
            font-weight: 600;
            color: #333;
            margin: 0 0 12px;
        }
        
        .page-description {
            font-size: 16px;
            color: #666;
        }
    }
}
</style>